#{extends 'magicBox.html' /}
#{set 'title'}
 #{if currentProject && users}#{drag 'projectusers-'+currentProject.id /}
 #{/if}
 ${title}
 #{if user!=null}
  #{if (user.id == connected.id)||(connected.isAdmin)}
    <a href="javascript:overlayOpen('/users/edit_mini_profile?userProfileId=${user.id}')">
    <img title="Edit Personal info" src="@{'/public/images/famfam/pencil.png'}">
    </a>
  #{/if}
#{/if}
#{/set}

#{if users !=null}
		#{if users.size()==0}
		#{note 'error'}No users#{/note}
		#{/if}
		#{list items:users ,as :'User'}
			<div class="reload-user-${User.id}" name="/users/find_users?project_id=${currentProject.id}&user_id=${User.id}">
			${User.name}
			<div class="bar_more_info">#{list items:currentProject.roles ,as :'Role'}
	#{if Role.name!="Project Member" && Role.users.contains(User)}${Role.name}#{/if}
		#{/list}</div>
		  #{drop 'user-'+User.id /}#{drag 'user-' + User.id /}
			 #{if (User.id == connected.id)||(connected.isAdmin)}
			   <a href="javascript:overlayOpen('/users/edit_mini_profile?userProfileId=${User.id}')">
			   <img title="Edit Personal info" src="@{'/public/images/famfam/pencil.png'}">
			   </a>
			 #{/if}
			</div>
		#{/list}
#{/if}
		
#{if user!=null}
		<div class="left">
		   #{if user.avatar !=""}
	         <img  height="100" width="100"src="${user.avatar}"/>
	       #{/if}
	       #{else}
	         <img  height="100" width="100"src="@{'public/images/no-profile.png'}"/>
	       #{/else}
		</div>
		<div class="left" style="padding:15px 10px">
			<p><b>Name: </b>${user.name}</p>
			<p><b>Email: </b>${user.email}</p>
			<p><b>Mobile Number: </b>#{if user.mobileNumber == null} Not Available!#{/if}#{else}${user.mobileNumber}#{/else}</p>
		</div>
		<br style="clear:both"/>
		<div class="reload-projects-in-user-${user.id}" name="/users/list_user_projects?userId=${user.id}&boxId=1&currentProjectId=${currentProject.id}">Projects <small>(${user.projects.size()})</small></div>
#{/if}